<!-- 支付成功 -->
<template>
	<div class="page_wrap">
		<header>
			<div class="h_left">
				<i class="iconfont iconarrowLeft-fill" @click="$router.go(-1)"></i>
			</div>
			<div class="h_center"><span>支付提示</span></div>
			<div class="h_right">
				<i class="iconfont icongengduo" style="visibility: hidden;"></i>
			</div>
		</header>

		<div class="main">
			<div class="pic_box">
				<div class="pic"><img src="../../assets/images/pay_success.gif" /></div>
				<p>支付成功！</p>
			</div>
			<div class="btn_box">
				<div class="btn btn2" @click="againBuy"><span data-name="继续购买">继续购买</span></div>
				<div class="btn" @click="seeOrder"><span data-name="查看订单">查看订单</span></div>
			</div>
		</div>
	</div>
</template>

<script>
	import { Toast, ActionSheet } from 'vant';

	export default {
		data() {
			return {};
		},
		watch: {},
		computed: {},
		components: {},
		beforeRouteEnter(to, from, next) {
			next();
		},
		beforeRouteLeave(to, from, next) {
			next();
		},
		activated() {},
		deactivated() {},
		created() {},
		mounted() {},
		methods: {
			againBuy() {
				this.$router.replace({
					name: 'home'
				})
			},
			seeOrder() {
				Toast({
					duration: 1500,
					message: "你别急，程序还没开发完呢！",
					forbidClick: true,
				});
			},
		}
	}
</script>

<style lang='scss' scoped>
	@import '~@/assets/css/mixin';
	.page_wrap {
		background: #fff;
	}
	
	//main
	.main {
		.pic_box {
			padding: rem(200) 0 rem(60) rem(0);
			display: flex;
			justify-content: center;
			align-items: center;
			flex-direction: column;
			.pic {
				img {
					width: rem(140);
				}
			}
			p {
				margin: rem(40) 0 0 0;
				font-size: rem(42);
				color: #333;
				font-weight: 700;
			}
		}
		.btn_box {
			padding: 0 rem(40);
			.btn {
				margin: 0 0 rem(40) 0;
				display: flex;
				justify-content: center;
				align-items: center;
				height: rem(90);
				border-radius: rem(90);
				border: rem(2) solid #ccc;
				span {
					font-size: rem(28);
					color: #333;
				}
			}
			.btn2 {
				border: none;
				background:  $theme-color;
				span {
					color: #fff;
				}
			}
		}
	}
</style>